﻿<!--_meta 作为公共模版分离出去-->
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="renderer" content="webkit|ie-comp|ie-stand">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
<meta http-equiv="Cache-Control" content="no-siteapp" />
{#<link rel="Bookmark" href="favicon.ico" >#}
{#<link rel="Shortcut Icon" href="favicon.ico" />#}
<!--[if lt IE 9]>
<script type="text/javascript" src="lib/html5.js"></script>
<script type="text/javascript" src="lib/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" type="text/css" href="/static/h-ui/css/H-ui.min.css" />
<link rel="stylesheet" type="text/css" href="/static/h-ui.admin/css/H-ui.admin.css" />
<link rel="stylesheet" type="text/css" href="/static/lib/Hui-iconfont/1.0.8/iconfont.css" />
<link rel="stylesheet" type="text/css" href="/static/h-ui.admin/skin/default/skin.css" id="skin" />
<link rel="stylesheet" type="text/css" href="/static/h-ui.admin/css/style.css" />
<link rel="stylesheet" type="text/css" href="/static/jqprint/css/printstyle.css" media="print"/>
<!--[if IE 6]>
<script type="text/javascript" src="http://lib.h-ui.net/DD_belatedPNG_0.0.8a-min.js" ></script>
<script>DD_belatedPNG.fix('*');</script><![endif]-->
<!--/meta 作为公共模版分离出去-->

<title>登记管理</title>



</head>
<body class="big-page">
<!--_header 作为公共模版分离出去-->
<header class="navbar-wrapper">
	<div class="navbar navbar-fixed-top">
		<div class="container-fluid cl">
			<span class="logo navbar-slogan f-l mr-10 hidden-xs">RayMin Logistics (Hong Kong) Limited</span>
			<a aria-hidden="false" class="nav-toggle Hui-iconfont visible-xs" href="javascript:;">&#xe667;</a>
		</div>
	</div>
</header>
<!--/_header 作为公共模版分离出去-->

<!--_menu 作为公共模版分离出去-->
<aside class="Hui-aside">
	
	<div class="menu_dropdown bk_2">
		<dl id="menu-article">
			<dt class="selected"><i class="Hui-iconfont">&#xe616;</i> 首页<i class="Hui-iconfont menu_dropdown-arrow">&#xe6d5;</i></dt>
			<dd style="display:block">
				<ul>
					<li class="current">
						<a href="#" title="登记管理">登记管理</a>
					</li>
				</ul>
			</dd>
		</dl>

	</div>
</aside>
<div class="dislpayArrow hidden-xs">
	<a class="pngfix open" href="javascript:void(0);" onClick="displaynavbar(this)"></a>
</div>
<!--/_menu 作为公共模版分离出去-->

<section class="Hui-article-box">
	<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页

{#		<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" href="javascript:location.replace(location.href);" title="刷新" ><i class="Hui-iconfont">&#xe68f;</i></a>#}
		<a class="btn btn-success radius r" style="line-height:1.6em;margin-top:3px" onclick="window.location.href = '/project/';" title="所有数据" >所有数据</a>
	</nav>
	<div class="Hui-article">
		<article class="cl pd-20">
        <form action="/searching/" method="post" id="searching">
			<div class="text-c">
                {% csrf_token %}
				日期范围：
				<input type="text" onfocus="WdatePicker({maxDate:'#F{$dp.$D(\'logmax\')||\'%y-%M-%d\'}'})" id="logmin" name="logmin" class="input-text Wdate" style="width:120px;">
				-
				<input type="text" onfocus="WdatePicker({minDate:'#F{$dp.$D(\'logmin\')}',maxDate:'%y-%M-%d'})" id="logmax" name="logmax" class="input-text Wdate" style="width:120px;">
				<input type="text" name="register_name" id="register_name" placeholder="公司名称" style="width:200px" class="input-text">
				<input type="text" name="license_num" id="license_num" placeholder="车牌号" style="width:120px" class="input-text">
				<input type="text" name="payment_account" id="payment_account" placeholder="登记费" style="width:120px" class="input-text">
				<button class="btn btn-success" type="submit" >查询</button>
				<button class="btn btn-success" type="button" onclick="handleReset()">重置</button>
			</div>
        </form>

			<div class="cl pd-5 bg-1 bk-gray mt-20">
				<span class="l">
				<a href="javascript:;" onClick="data_export(this)" class="btn btn-secondary radius">导出excel</a>
				<a class="btn btn-primary radius" data-title="添加" _href="article-add.html" onclick="article_add('添加','/project/add')" href="javascript:;"><i class="Hui-iconfont">&#xe600;</i>新增</a>
				</span>
{#				<span class="r">共有数据：<strong>xxx</strong> 条</span>#}
			</div>


			<div class="mt-20">
				<table class="table table-border table-bordered table-bg table-hover table-sort">
					<thead>
						<tr class="text-c">
{#							<th width="20"><input type="checkbox" name="" value=""></th>#}
                            <th width=50">ID</th>
                            <th width="100">创建时间</th>
                            <th width="65">单号</th>
							<th width="120">公司名</th>
                            <th width="70">车牌号</th>
							<th width="80">登记费</th>
                            <th width="40">是否打印</th>
                            <th width="25">作废</th>
                            <th width="100">备注</th>
                            <th width="60">操作</th>
						</tr>
					</thead>
					<tbody>
                    {% for item in all_items %}
                        <tr class="text-c">
{#							<td><input type="checkbox" value="" name=""></td>#}
							<td>{{ item.id }}</td>
							<td>{{ item.create_time }}</td>
							<td class="text-l">{{ item.receipt }}</td>
							<td>{{ item.register_name }}</td>
							<td>{{ item.license_num }}</td>
							<td>{{ item.payment_account }}</td>
							<td class="td-status">{{ item.get_is_print_display }}</td>
{#							<td class="td-status"><span class="label label-success radius">{{ item.get_is_print_display }}</span></td>#}
                            <td id="is-abandon">{{ item.get_is_abandon_display }}</td>
                            <td>{{ item.remark }}</td>
							<td class="f-14 td-manage">
{#                                <a style="text-decoration:none" onClick="item_print(this,{{ item.id }})" href="javascript:;" title="打印"><i class="Hui-iconfont">&#xe6de;</i></a>#}
                                <a style="text-decoration:none"
                                   onClick="print_with_jqprint(this, {{ item.id }}, '{{ item.receipt }}', '{{ item.register_name }}', '{{ item.license_num }}', '{{ item.payment_account }}')"
                                   href="javascript:;" title="打印">
                                    <i class="Hui-iconfont">&#xe6de;</i></a>
								{% if item.is_print == 0 %}
                                <a style="text-decoration:none" class="ml-5" onClick="article_edit('编辑','/project/update/?id='+ {{ item.id }})" href="javascript:;" title="编辑"><i class="Hui-iconfont">&#xe6df;</i></a>
								{% endif %}
                                {% if item.is_print == 1 and item.is_abandon == 0 %}
                                {% else %}
                                    <a style="text-decoration:none" class="ml-5" onClick="item_del(this,'{{ item.id }}')" href="javascript:;" title="删除"><i
                                            class="Hui-iconfont">&#xe6e2;</i></a>
                                {% endif %}
                                <a class="btn-link" onClick="article_shenhe(this,'{{ item.id }}')" href="javascript:;" title="作废">作废</a>
                            </td>

						</tr>
                    {% endfor %}

					</tbody>
				</table>
			</div>
		</article>
	</div>
</section>


<div class="ticket">
    <div class="rayminlogo">
        <img src="/static/img/logo.png" style="width: 60px;height: 38px;" alt="logo"/>
    </div>
    <div class="info">
        <p class="title">RayMin Logistics (Hong Kong) Limited</p>
{#        <p>Gridlines 4022W-4024W,</p>#}
{#        <p>ATL Logistics Centre A, Berth 3,</p>#}
{#        <p>Kwai Chung Container Terminal,Kwai Chung, Hong Kong</p>#}
{#        <p>Tel:(852) 2498 8739 Fax:(852) 2498 8126</p>#}
    </div>

    <div class="content">
        <p class="title">Registration Fee 進倉登記費</p>
        <p>============================</p>
        <p>Receipt No. : &nbsp;&nbsp;&nbsp;&nbsp;<span id="con-receipt">202003250001</span></p>
        <p>Reg : &nbsp;&nbsp;&nbsp;&nbsp;<span id="con-reg">2020-03-25 17:12</span></p>
        <p>Register Name : &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<span id="con-register">RM</span></p>
        <p>License No. : &nbsp;&nbsp;&nbsp;&nbsp;<span id="con-license">PJ****</span></p>
        <p>Total Payment Amount : HK$ <span id="con-payment">120.00</span></p>
        <p style="margin-bottom: 0">============================</p>
    </div>
    <div class="footer">
        <p>End of Receipt</p>
    </div>

</div>

<!--_footer 作为公共模版分离出去-->
<script type="text/javascript" src="/static/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="/static/lib/layer/2.4/layer.js"></script>
<script type="text/javascript" src="/static/h-ui/js/H-ui.js"></script>
<script type="text/javascript" src="/static/h-ui.admin/js/H-ui.admin.page.js"></script>
<!--/_footer /作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript" src="/static/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript" src="/static/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/static/lib/laypage/1.2/laypage.js"></script>

<script type="text/javascript" src="/static/jqprint/jqprint.js"></script>
<script type="text/javascript" src="/static/jqprint/jquery-migrate-1.2.1.min.js"></script>
<script type="text/javascript" src="/static/lib/xlsx.core.min.js"></script>

<script type="text/javascript">

//layer.confirm('确认要打印吗？',function(index){
		//$(obj).parents("tr").find(".td-manage").prepend('<a style="text-decoration:none" onClick="article_start(this,id)" href="javascript:;" title="发布"><i class="Hui-iconfont">&#xe603;</i></a>');
		//$(obj).parents("tr").find(".td-status").html('<span class="label label-defaunt radius">已下架</span>');
		//$(obj).remove();
	//	layer.msg('已下架!',{icon: 5,time:1000});
	//});

$('.table-sort').dataTable({
	"aaSorting": [[ 0, "desc" ]],//默认第几个排序
	"bStateSave": true,//状态保存
    "searching": false,
	"aoColumnDefs": [
		//{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
        {"orderable": false, "aTargets": [1, 2, 3, 4, 5, 6, 7, 8, 9]}// 不参与排序的列
	]
});

function handleSearch() {
    var register_name = $("#register_name").val();
    var payment_account = $('#payment_account').val();
    var license_num = $('#license_num').val();
    var logmin = $('#logmin').val();
    var logmax = $('#logmax').val();
    var token = '{{csrf_token}}';

    $.ajax({
			'type': 'POST',
            'headers': { "X-CSRFToken": token},
			'url': "xxxxxxxxxxxx",
            'data': {'register_name': register_name, 'payment_account':payment_account, 'license_num': license_num},
			'success': function (res) {
			    console.log(res);
			},
			'error': function () {
				console.log('错误');
			}
		});

}

function filter_words(){
    $("#register_name").val('{{ params.register_name }}');
    $('#payment_account').val('{{ params.payment_account }}');
    $('#license_num').val('{{ params.license_num }}');
    $('#logmin').val("{{ params.logmin }}");
    $('#logmax').val("{{ params.logmax }}");
}

function handleReset(){
    {#window.location.href = '/project/';#}
    $("#register_name").val('');
    $('#payment_account').val('');
    $('#license_num').val('');
    $('#logmin').val("");
    $('#logmax').val("");
}

function data_export(obj){
    var token = '{{csrf_token}}';
    {#var total = '{{ total }}';#}
        $.ajax({
            'headers': { "X-CSRFToken": token},
			type: 'POST',
			url: '/export/',
			dataType: 'json',
            data: {'register_name': '{{ params.register_name }}',
                'payment_account':'{{ params.payment_account }}',
                'license_num': '{{ params.license_num }}',
                'logmin': '{{ params.logmin }}',
                'logmax': '{{ params.logmax }}',
                },
			success: function(res){
			    if (res.code == 0) {
			        let json_data = res.data;
			        let filename = res.filename;
			        let total = res.total;
                    //layer.msg('正在导出!', {icon: 1,time:2000});
                    layer.confirm("导出" + total + "条数据，" + "若超过1万条数据，请分批导出",
                        function () {
                            layer.msg('正在导出!', {icon: 1, time: 2000})
                            dataToExcel(json_data, filename);
                        });
                }
			},
			error:function(data) {
				layer.msg(data.msg);
			},
		});

}

function createWs(data, fields, titles) {
    const ws = XLSX.utils.json_to_sheet(
		        data,
		        {
		            header: fields
		        }
		    );
		    const range = XLSX.utils.decode_range(ws['!ref'])

		    for(let c = range.s.c; c <= range.e.c; c++) {
		      const header = XLSX.utils.encode_col(c) + '1'
		      ws[header].v = titles[ ws[header].v ]
		    }

		    return ws
}

function dataToExcel(data, filename){
      var wopts = { bookType: 'xlsx', bookSST: false, type: 'binary' };//这里的数据是用来定义导出的格式类型
      {#const wopts = { bookType: 'biff2', bookSST: false, type: 'binary' };//xls格式#}

      var wb = { SheetNames: ['Sheet1'], Sheets: {}, Props: {} };
      {#wb.Sheets['Sheet1'] = XLSX.utils.json_to_sheet(data);#}

    var fields = ['id', 'receipt', 'register_name', 'license_num', 'payment_account', 'create_time', 'remark'];
      var titles = {
            id: 'id',
            receipt: '单号',
            register_name: '公司名',
            license_num:'车牌号',
            payment_account:'登记费',
            create_time:'创建时间',
          remark: '备注',
      };
      wb.Sheets['Sheet1'] = createWs(data, fields, titles);

      var str = XLSX.write(wb, wopts);
      var buffer = new ArrayBuffer(str.length);
      var view = new Uint8Array(buffer);
      for (var i = 0; i != str.length; ++i) view[i] = str.charCodeAt(i) & 0xFF;

       var e = document.createElement('a');
       e.download = filename;
       e.style.display = 'none';
       var blob = new Blob([buffer], { type: "application/octet-stream" });
       e.href = URL.createObjectURL(blob);
       document.body.appendChild(e);
       e.click();
       document.body.removeChild(e);
};


function print_with_jqprint(obj, item_id, receipt, register_name, license_num, payment_account) {
    console.log(receipt, register_name, license_num, payment_account);
    var d = new Date();
    let d_date=d.toLocaleDateString().replace(/\//g, '-');
    let d_time=d.getHours()+':'+d.getMinutes();
    $('#con-receipt').html(receipt);
    $('#con-reg').html(d_date+' '+d_time);
    $('#con-register').html(register_name);
    $('#con-license').html(license_num);
    $('#con-payment').html(payment_account);

    $(".ticket").jqprint({
        debug: false, //如果是true则可以显示iframe查看效果（iframe默认高和宽都很小，可以再源码中调大），默认是false
        importCSS: true, //true表示引进原来的页面的css，默认是true。（如果是true，先会找$("link[media=print]")，若没有会去找$("link")中的css文件）
        printContainer: true, //表示如果原来选择的对象必须被纳入打印（注意：设置为false可能会打破你的CSS规则）。
        //operaSupport: true,//表示如果插件也必须支持歌opera浏览器，在这种情况下，它提供了建立一个临时的打印选项卡。默认是true
        //printTime: 6000,
    });

    // 修改后台打印状态
    $.ajax({
			type: 'GET',
			url: '/printing/',
			dataType: 'json',
            data: {'id': item_id},
			success: function(data){
			    if (data.code == 0) {
                    $(obj).parents("tr").find(".td-status").html('<span>已打印</span>');
				    layer.msg('打印中......',{icon:1,time:2000});
                } else {
                    layer.msg(data.msg, {icon: 5, time: 1000});
                }
			},
			error:function(data) {
				layer.msg(data.msg);
			},
		});
}

/*资讯-审核*/
function article_shenhe(obj, id) {
    layer.confirm('是否作废？',
        //{btn: ['通过','不通过','取消'], shade: false, closeBtn: 0 },
        function () {
            //$(obj).parents("tr").find(".td-status").html('<span class="label label-success radius">已发布</span>');
            {#$(obj).parents("tr").find(".td-status").html('');#}
            {#$(obj).remove();#}
            $.ajax({
                type: 'GET',
                url: '/abandon/',
                dataType: 'json',
                data: {'id': id},
                success: function (data) {
                    if (data.code == 0) {
                        $(obj).parents('tr').find('#is-abandon').html('<span>是</span>');
                        layer.msg('已作废', {icon: 6, time: 1000});
                    } else {
                        layer.msg('无法设置作废，请刷新重试', {icon: 7, time: 1000})
                    }
                },
                error: function (data) {
                    layer.msg(data.msg);
                },
            });
        }
    );
}

/*资讯-添加*/
function article_add(title, url, w, h = 500) {
	{#var index = layer.open({#}
	{#	type: 2,#}
	{#	title: title,#}
	{#	content: url#}
	//});
	{#layer.full(index);#}
	layer_show(title, url, w, h);
}
/*资讯-编辑*/
function article_edit(title, url, w, h = 500) {
	{#var index = layer.open({#}
	{#	type: 2,#}
	{#	title: title,#}
	{#	content: url#}
	//});
	{#layer.full(index);#}
	layer_show(title, url, w, h);
}

/*记录-删除*/
function item_del(obj, id) {
	layer.confirm('确认要删除吗？',function(index){
		$.ajax({
            type: 'GET',
            url: 'project/del/',
            data: {'id': id},
			dataType: 'json',
			success: function(data){
                if (data.code == 0) {
                    $(obj).parents("tr").remove();
                    layer.msg('已删除!', {icon: 1, time: 1000});
                } else {
                    layer.msg(data.msg, {icon: 7, time: 1000})
                }
			},
			error:function(data) {
				console.log(data.msg);
			},
		});		
	});
}

filter_words();

</script>
<!--/请在上方写此页面业务相关的脚本-->
</body>
</html>